<template>
	<view class="table-container" style="height: 400px;">
		<uni-table stripe type="selection" emptyText="暂无更多数据">
			<uni-tr class="head">
				<uni-th align="center" width="30">ID</uni-th>
				<uni-th>用户</uni-th>
				<uni-th>姓名</uni-th>
				<uni-th width="50">性别</uni-th>
				<uni-th width="160">身份证</uni-th>
				<uni-th>状态</uni-th>
				<uni-th>审核</uni-th>
				<uni-th width="160">过期时间</uni-th>
				<uni-th>
					<view style="display: flex;align-items: center;gap: 10px;">
						<view class="gl-link gl-link-base" @click="loadDefData">刷新</view>
					</view>
				</uni-th>
			</uni-tr>

			<uni-tr v-for="(item, index) in tmpData" :key="index">
				<uni-td>{{item.id}}</uni-td>
				<uni-td>
					<view style="display: flex;align-items: center;gap: 10px;">
						<image :src="sConf.cos + item.sub_staff.face" mode="scaleToFill"
							style="width: 40px;height: 40px;border-radius: 50% 50%;"></image>
						<text>{{item.sub_staff.nicename}}</text>
					</view>
				</uni-td>
				<uni-td>{{item.name}}</uni-td>
				<uni-td> <text>{{zipGender(item.sub_staff.gender)}}</text></uni-td>
				<uni-td>{{item.idcard}}</uni-td>
				<uni-td
					:class="{'tcBase':item.status===0,'tcSuccess':item.status===1, 'tcError':item.status===2}">{{zipState(item.status)}}</uni-td>
				<uni-td>{{item.sub_answer?.nicename || ''}}</uni-td>
				<uni-td :class="{'tcError': zipOuttime(item.outtime)}">{{item.outtime}}</uni-td>
				<uni-td>
					<view style="display: flex;align-items: center;gap: 10px;">
						<view class="gl-link gl-link-base" @click="eventStaffInfo(item.id)">查看</view>
					</view>
				</uni-td>
			</uni-tr>

		</uni-table>
		<view class="gl-footer">
			<uni-pagination :show-icon="true" :total="count" :pageSize="size" v-model="page" title="翻页"
				@change="loadDefData" />
		</view>
		<!-- 模态窗口 -->
		<popStaffIdcardVue ref="popStaffIdcard" @reload="loadDefData"></popStaffIdcardVue>
	</view>
</template>

<script>
	import psMethod from '@/common/psMethod';
	import popStaffIdcardVue from '@/pages/staff/pop-staff-idcard.vue';
	export default {
		data() {
			return {
				count: 0, // 记录数
				size: 50, // 页大小
				page: 1, // 当前页
				curpage: 0,
				title: '个人认证',
				sConf: getApp().globalData,
				curSID: null,
				tmpData: []
			}
		},
		props: {
			sid: {
				type: Number,
				default: null
			}
		},
		components: {
			popStaffIdcardVue
		},
		methods: {
			open(e) {
				console.log('open', e);
				this.curSid = e
				this.page = 1
				this.loadDefData()
			},
			async loadDefData() {
				await this.loadGiveWalletList().then(res => {
					console.log('加载认证记录成功', res);
					this.tmpData = res.resmsg;
					this.count = res.count;
					this.size = res.size;
				})

			},
			zipState(e) {
				if (e === 0) {
					return '待审'
				} else if (e === 1) {
					return '通过'
				} else if (e === 2) {
					return '驳回'
				} else {
					return '失效'
				}
			},
			zipGender(e) {
				return psMethod.zipGender(e)
			},
			zipOuttime(timer) {
				let timestamp = new Date(timer).getTime();
				let curstamp = Date.parse(new Date());
				return Math.ceil((timestamp - curstamp) / 1000) < 3600 * 24 * 3 ? true : false
			},
			eventStaffInfo(e) {
				console.log('eventStaffInfo', e);
				this.$refs.popStaffIdcard.open(e);
			},
			loadGiveWalletList() {
				let host = this.sConf.host + '/admin/verifyStaff/'
				let token = this.sConf.auth.token
				let data = {
					'page': this.page,
					'size': this.size,
					'sid': this.sid,
					'ordering': 'outtime'
				};
				return new Promise((resolve, reject) => {
					psMethod.authenticatorGetSync(host, token, data).then(res => {
						resolve(res)
					}).catch(err => {
						reject(err)
					})
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.tcBase {
		color: #007aff;
	}

	.tcSuccess {
		color: #4cd964;
	}

	.tcWarn {
		color: #f0ad4e;
	}

	.tcError {
		color: #dd524d;
	}
</style>